<link rel="stylesheet" type="text/css" href="<?php echo TEMPLATES_PATH;?>/css/address.css">
<link rel="stylesheet" type="text/css" href="<?php echo TEMPLATES_PATH;?>/css/payPassword.css">
<script type="text/javascript" src="<?php echo RESOURCE_PATH;?>/js/jquery.validation.min.js"></script>
<header class="layout head padding-small">
    <a href="javascript:back(true);" class="hBack float-left"></a>
    <h4 class="hTxt float-left text-center text-white">绑定/修改手机</h4>
    <a href="javascript:;" id="btnJdkey" class="hHlep float-right"></a>
</header>
<div class="margin bg-white padding radius-big">
    <!--修改手机的步骤S-->

<?php if($_SESSION['member_mobile']!='' ){ ?>
<div class="revise-mobile">
    <div class="step">
        <!--正在那一步的添加类active  已经通过了的添加类complete-->
        <div class="step-bar <?php echo (!$output['step'])?'active':''?> " style="width:50%;"><span class="step-point  <?php echo (!$output['step'])?'icon-check':''?> "></span><span class="step-text">身份验证</span></span></div>
        <div class="step-bar <?php echo ($output['step'] == true)?'active':''?>" style="width:50%;"><span class="step-point <?php echo ($output['step'] == true)?'icon-check':''?>">2</span><span class="step-text">绑定新手机</span></div>
    </div>
</div>
<?php }?>

<form id="mobile_form"  method="post" action="#">
<input type="hidden" name="form_submit" value="ok" />
<?php if($_SESSION['member_mobile']!='' && !$output['step']){ ?>
<input type="hidden" name="old_mobile" id="old_mobile" value="<?php echo $_SESSION['member_mobile']?>" />
<input type="hidden" name="step" value="false" />
<?php }elseif($_SESSION['member_mobile']!='' && $output['step'] == true){?>
<input type="hidden" name="step" value="true" />
<?php }?>
<div class="new-ct">
	<div class="new-addr">
        <div class="new-info-box" style="border: 0px;">
            <div class="new-set-info">
                <span class="new-txt2 new-mg-b5"><em style="color:#F00;">&lowast;</em>手机号码<?php echo  ($_SESSION['member_mobile']!='' && !$output['step'])?'：'.substr_replace($_SESSION['member_mobile'],'****',3,4):'';?></span>
				<span class="new-input-span new-mg-b5">
                	<?php if($_SESSION['member_mobile'] == '' || $output['step'] == true){?>
					<input type="text" name="mobile" id="mobile"  placeholder="请输入您需绑定的手机号码"  class="border border-ef7f7e layout padding radius-big " value="" autocomplete="off">
                    <?php }?>
                    <span id="notify" style=" font-size:12px; color:#F00;display:none;">
						验证码已经以短信形式发到您的手机，30分钟内有效,请及时操作！
					</span>
				</span>
				<span class="new-txt2 new-mg-b5"><em style="color:#F00;">&lowast;</em>验证码<input type="button" id="getCode1" value="获取短信验证码" class="bg-red text-white padding margin-left radius-big border-none "></span>
                <span class="new-span-block new-mg-b5">
                    <span class="new-input-span">
                    	<input type="text" name="code" id="code"  placeholder="请输入短信验证码"  class="border border-ef7f7e layout padding radius-big " value="" autocomplete="off">
                    </span>
                </span>
            </div>
            <!--[D] 默认时加  new-abtn-default 把a标签换成span-->
            <a href="javascript:void();" name="order_submit" onclick="$('#mobile_form ').submit()" class="border-none bg-red text-white layout padding radius-big" style="text-align: center;"><?php echo ($_SESSION['member_mobile']!='' && !$output['step'])?'下一步':'提交';?></a>
        </div>
	</div>
</div>
</form>
</div>
<script type="text/javascript">	

$('#getCode1').click(function () {
	var mobile =<?php echo ($_SESSION['member_mobile']!='' && !$output['step'])?"$('#old_mobile').val()":"$('#mobile').val()";?>;
	var type = '<?php echo ($_SESSION['member_mobile']!='' && !$output['step'])?"old":"new";?>';
	var outTime = <?php echo MOBILE_VALID_RESEND_TERM*2;?>;
	if(!(/^1[3|5|7|8]{1}\d{9}$/i.test(mobile))){ alert('手机号码不正确'); return false;}
	var ct= setInterval(CountDown, 1000);
	function CountDown() {
		$("#getCode1").attr("disabled", true);
		$("#getCode1").val(outTime + " 秒后重发");
		if (outTime == 0) {
			$("#getCode1").val("获取短信验证码").removeAttr("disabled");
			$('#notify').hide();
			clearInterval(ct);
		}
		outTime--;
	}
	$.getJSON('index.php?act=member_index&op=ajax_get_code_mobile',{mobile:mobile,type:type},function (data){
		if(data.state==true){
			$('#notify').show();
		}else{
			clearInterval(ct);
			alert(data.msg);
		}
	});
})

$(function(){
	jQuery.validator.addMethod("mob_rul", function(value, element) {
		return this.optional(element) || /^1[3|5|7|8]{1}\d{9}$/i.test(value);
	}, "手机号码输入错误"); 
	
    $('#mobile_form').validate({
		errorPlacement: function(error, element){
            var error_td = element.parent('span');
            error_td.find('label').hide();
            error_td.append(error);
        },
        rules : {
           mobile : {
				required: true,
				mob_rul:true,
				remote   : {
                    url : 'index.php?act=register&op=checkMobile',
                    type: 'get',
                    data:{
                        mobile : function(){
                            return $('#mobile').val();
                        }
                    }
                },
            },
			code:{
				required: true,
			},
        },
        messages : {
            mobile : {
                required : '手机号码不能为空',
                number  : '手机号码输入错误',
				remote	:	'手机号码已存在',
            },
			code:{
				required:'验证码不能为空',
			}
        },
        submitHandler: function(form){
            $.post("<?php echo SiteUrl;?>/app/index.php?act=member_index&op=mod_mobile",$("form#mobile_form").serialize(),function(data){
                Jump(data);
            },'json');
        }
    });

});
</script>









